<template>
  <div id="fh5co-main">
    <div class="fh5co-narrow-content">
      <div class="row row-bottom-padded-md">
        <div class="col-md-6 animate-box" data-animate-effect="fadeInLeft">
          <img class="img-responsive" src="../../static/images/img_bg_5.jpg" alt="Free HTML5 Bootstrap Template by FreeHTML5.co">
        </div>
        <div class="col-md-6 animate-box" data-animate-effect="fadeInLeft">
          <h2 class="fh5co-heading">About Notes</h2>
          <p>此笔记用来记录我们的点滴成长，由于目前知识有限，如遇错误恳请通过邮件留下您宝贵的意见或建议，我们将感谢您的来信。今天以前是个梦，今天以后是个迷，让我们珍惜当下，一起成长❤️</p>
          <a class="btn btn-primary btn-md" @click="wxalert()"  href="mailto:1020278488@qq.com?cc=chwangyanan@foxmail.com&subject=博客纠错" target="_top">Send Message</a>
        </div>
      </div>
    </div>
    <div class="fh5co-narrow-content">
      <h2 class="fh5co-heading animate-box" data-animate-effect="fadeInLeft">Skills</h2>
      <div class="row">
        <div class="col-md-6">
          <div class="fh5co-feature animate-box" data-animate-effect="fadeInLeft">
            <div class="fh5co-icon">
              <i class="icon-settings"></i>
            </div>
            <div class="fh5co-text">
              <h3>前端开发</h3>
              <p>1. HTML+CSS+JS前端三把斧</p>
              <p>2. 前后端数据交互，注重用户体验</p>
              <p>3. Vue / Angular / React等</p>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="fh5co-feature animate-box" data-animate-effect="fadeInLeft">
            <div class="fh5co-icon">
              <i class="icon-search4"></i>
            </div>
            <div class="fh5co-text">
              <h3>Java</h3>
              <p>1. Linux</p>
              <p>2. Database</p>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="fh5co-feature animate-box" data-animate-effect="fadeInLeft">
            <div class="fh5co-icon">
              <i class="icon-paperplane"></i>
            </div>
            <div class="fh5co-text">
              <h3>UI设计</h3>
              <p>1. PS / Sketch等设计软件以及基本设计知识</p>
              <p>2. 了解相关程序代码及实现难易程度</p>
              <p>3. 了解对市面各种硬件设备（如手机）的尺寸、分辨率等</p>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="fh5co-feature animate-box" data-animate-effect="fadeInLeft">
            <div class="fh5co-icon">
              <i class="icon-params"></i>
            </div>
            <div class="fh5co-text">
              <h3>php</h3>
              <p>1. HTML+CSS+JS+AJAX等前端必备知识</p>
              <p>2. PHP基础语法</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    methods: {
      wxalert() {
        var ua = window.navigator.userAgent.toLowerCase()
        if (ua.indexOf('android') > -1 && ua.indexOf('micromessenger') > -1) {
          alert('抱歉，点击右上角您可以在浏览器中打开')
        }
      }
    }
  }

</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>


</style>
